import React, { useContext } from 'react'
import { Context } from '../../context'
import './index.scss'
export default function MyCount({ goods_count, id }) {
  const changeCount = useContext(Context)
  const decrement = () => {
    const num = goods_count - 1
    if (num <= 0) {
      return
    }
    // 准备数字和 id，传给爷爷，让其爷爷修改
    changeCount(id, num)
  }
  const increment = () => {
    changeCount(id, goods_count + 1)
  }
  return (
    <div className='my-counter'>
      <button type='button' className='btn btn-light' onClick={decrement}>
        -
      </button>
      <input
        type='number'
        className='form-control inp'
        value={goods_count}
        onChange={() => {}}
        disabled
      />
      <button type='button' className='btn btn-light' onClick={increment}>
        +
      </button>
    </div>
  )
}
